<template>
  <div class="app-container">
    <el-table :data="goodList" v-loading.body="listLoading" element-loading-text="Loading" border fit highlight-current-row>
      <el-table-column label="商品名称" prop='name'>
      </el-table-column>
      <el-table-column label="价格" prop='price'>
      </el-table-column>
      <el-table-column label="描述" prop='description'>
      </el-table-column>
      <el-table-column label="商品状态" prop='status'>
      </el-table-column>
      <el-table-column label="推荐状态" prop='status'>
        <template slot-scope="scope">
          <span>{{ scope.row.status? '推荐':'不推荐' }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="100">
        <template slot-scope="scope">
          <el-button @click.prevent="editGood(scope.row)" type="text" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import { getGoods } from '@/api/good'

export default {
  name: 'goodManage',
  data() {
    return {
      goodList: [],
      listLoading: false
    }
  },
  mounted() {
    this.getGoods()
  },
  methods: {
    getGoods() {
      getGoods().then((response) => {
        const data = response.data.result
        this.goodList = data
      })
    },
    editGood(good) {}
  }
}
</script>
<style lang="scss" scoped>
</style>
